<template>
	<view :data-theme="theme()" :class="theme() || ''">
		<diy style="position: relative;" :diyItems="items" :userInfo="{
				detail,
				coupon,
				orderCount,
				msgcount,
				jweixin
			}">
			<view class="bind_phone" v-if="getPhone">
				<view class="bind_content">
					<view class="bind_txt">确保账户安全，请绑定手机号</view>
					<!-- #ifdef MP-WEIXIN -->
					<button open-type="getPhoneNumber" class="bind_btn" @getphonenumber="getPhoneNumber"
						v-if="wxBinding">去绑定</button>
					<button class="bind_btn" v-else @click="bindMobile">去绑定</button>
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<button class="bind_btn" @click="bindMobile">去绑定</button>
					<!-- #endif -->
				</view>
			</view>
		</diy>
		<request-loading :loadding="isloadding"></request-loading>
		<tabBar></tabBar>
	</view>
</template>

<script>
	import diy from '@/components/diy/diy.vue';
	export default {
		components: {
			diy
		},
		data() {
			return {
				items: [],
				isloadding: true,
				/*是否加载完成*/
				loadding: true,
				detail: {
					balance: 0,
					points: 0,
					grade: {
						name: ''
					}
				},
				orderCount: {},
				coupon: 0,
				user_type: '', //用户状态
				msgcount: 0, //用户未读消息
				sessionKey: '',
				wxBinding: false,
				getPhone: false,
				urls: '',
				jweixin: null
			};
		},
		onReady() {
			uni.hideTabBar();
		},
		onPullDownRefresh() {
			let self = this;
			self.getData();
		},
		onShow() {
			/*获取个人中心数据*/
			this.getData();
		},
		onLoad() {
			let self = this;
			self.wxBinding = uni.getStorageSync('wxBinding');
			// if (e.referee_id) {
			// 	uni.setStorageSync('referee_id', e.referee_id);
			// }
			//#ifdef H5
			if (this.isWeixin()) {
				this.urls = window.location.href;
			}
			//#endif
			//#ifdef MP-WEIXIN
			wx.login({
				success(res) {
					// 发送用户信息
					self._post(
						'user.user/getSession', {
							code: res.code
						},
						result => {
							self.sessionKey = result.data.session_key;
						}
					);
				}
			});
			//#endif
		},
		methods: {
			/*获取数据*/
			getData() {
				let self = this;
				self.isloadding = true;
				uni.showLoading({
					title: '加载中'
				});
				self._get(
					'user.index/center', {
						url: self.urls
					},
					function(res) {
						self.detail = res.data.userInfo;
						self.coupon = res.data.coupon;
						self.orderCount = res.data.orderCount;
						self.msgcount = res.data.msgcount;
						self.getPhone = res.data.getPhone;
						self.loadding = false;
						self.items = res.data.page.items;
						// 配置微信扫一扫参数
						//#ifdef H5
						if (self.url != '') {
							self.jweixin = self.configWxScan(res.data.signPackage);
						}
						//#endif
						self.setPage(res.data.page.page);
						self.loadding = false;
						uni.stopPullDownRefresh();
						uni.hideLoading();
						self.isloadding = false;
					}
				);
			},
			/*设置页面*/
			setPage(page) {
				uni.setNavigationBarTitle({
					title: page.params.name
				});
			},
			bindMobile() {
				this.gotoPage('/pages/user/modify-phone/modify-phone');
			},
			/*扫一扫核销*/
			scanQrcode: function() {
				this.gotoPage('/pages/user/scan/scan');
			},
			getPhoneNumber(e) {
				var self = this;
				if (e.detail.errMsg !== 'getPhoneNumber:ok') {
					return false;
				}
				uni.showLoading({
					title: '加载中'
				});
				uni.login({
					success(res) {
						// 发送用户信息
						self._post(
							'user.user/bindMobile', {
								session_key: self.sessionKey,
								encrypted_data: e.detail.encryptedData,
								iv: e.detail.iv
							},
							result => {
								uni.showToast({
									title: '绑定成功'
								});
								// 执行回调函数
								self.detail.mobile = result.data.mobile;
							},
							false,
							() => {
								uni.hideLoading();
							}
						);
					}
				});
			}
		}
	};
</script>

<style lang="scss">
	.bind_phone {
		width: 100%;
		height: 80rpx;
		padding: 0 20rpx;
		box-sizing: border-box;
		margin-top: 20rpx;
	}

	.bind_content {
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: #ffffff;
		/* box-shadow: 0 0 6rpx 0 rgba(0, 0, 0, 0.1); */
		border-radius: 16rpx;
		height: 100%;
		padding: 0 20rpx;
	}

	.bind_txt {}

	.bind_btn {
		width: 134rpx;
		height: 50rpx;
		line-height: 50rpx;
		font-size: 22rpx;
		border-radius: 25rpx;
		text-align: center;
		color: #ffffff;
		background-color: $dominant-color;
	}
</style>